<!doctype html>
<html class="no-js">
  <head>
    <meta charset="utf-8">
    <title>ui_comp</title>
    <meta name="keywords" content="">
    <meta name="description" content="">
    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="renderer" content="webkit">
    <!-- page plugin -->
    <link rel="stylesheet" type="text/css" href="../styles/plugins/grid/bsgrid.all.min.css">
    <!-- page plugin end -->
	<link rel="stylesheet" href="../../css/core/bootstrap/bootstrap.css">
    <!--[if lt IE 9]>
    <script src="scripts/ie9.js"></script>
    <![endif]-->
    
    <style type="text/css">
    .ibox{margin-bottom:0}
    </style>
    
  </head>
  <body>
    <div class="wrapper wrapper-content">
      <div class="row">
        <div class="col-md-12">
          <div class="ibox float-e-margins">
            <div class="ibox-title">
              <h5><i class="fa fa-building-o"></i> 小区用户登记管理</h5>
              <div class="ibox-tools">
                <a class="collapse-link">
                  <i class="fa fa-chevron-up"></i>
                </a>
                <a class="close-link">
                  <i class="fa fa-times"></i>
                </a>
              </div>
            </div>
            <div class="ibox-content" style="padding:0">
              <form action="#" class="form-inline mbl">
                <div class="form-body">
                  <div class="form-group">
                    <input type="text" class="form-control input-sm" placeholder="登录账号">
                  </div>
                  <div class="form-group">
                    <input type="text" class="form-control input-sm" placeholder="业主名称">
                  </div>
                  <div class="form-group">
                    <select class="form-control input-sm" placeholder="帐号状态">
                      <option value="">帐号状态</option>
                      <option>正常</option>
                      <option>禁用</option>
                      <option>冻结</option>
                    </select>
                  </div>
                  <div class="form-group">
                    <select class="form-control input-sm" placeholder="审核状态">
                      <option value="">小区名字</option>
                      <option>武侯名居</option>
                      <option>双栏小区</option>
                      <option>龙江小区</option>
                    </select>
                  </div>
                  <div class="form-group">
                    <div class="input-daterange input-group" id="datetime_01">
                      <input type="text" class="input-sm form-control date" name="start" placeholder="注册时间"/>
                      <span class="input-group-addon">到</span>
                      <input type="text" class="input-sm form-control date" name="end" placeholder="注册时间"/>
                    </div>
                  </div>
                 
                  <div class="form-group">
                    <button type="submit" class="btn btn-sm btn-primary"><i class="fa fa-search"></i>搜索</button>
                    <button type="button" class="btn btn-sm mls">重置</button>
                  </div>
                </div>
              </form>
              <div class="grid_wrapper">
                <div class="mbm">
                  <input type="hidden" id="ids">
                  <button id="btn_refresh" type="button" class="btn btn-sm btn-primary" onclick="window.location.reload();">刷新</button>
                  <button id="btn_create" type="button" class="btn btn-sm btn-primary" data-toggle="modal" data-target="#add-update-panel">新增</button>
                </div>
                <table id="searchTable" class="table table-condensed table-bordered table-striped table-hover">
                  <tr>
                    <th w_index="XH" width="5%;">记录</th>
                    <th w_index="account" w_align="left" width="10%;">登录账号</th>
                    <th w_index="area" w_align="left" width="10%;">小区名字</th>
                    <th w_index="ld" w_align="left" width="10%;">楼栋号</th>
                    <th w_index="dy" width="10%;">单元号</th>
                    <th w_index="mp" width="10%;">门牌号</th>
                    <th w_index="name" width="10%;">业主名称</th>
                    <th w_index="type" width="10%;">用户类型</th>
                    <th w_index="date" width="15%;">注册时间</th>
                    <th w_index="state" width="10%;">账号状态</th>
                    <th w_render="operate" width="10%;">操作</th>
                  </tr>
                </table>
              </div>
            </div>
          </div>
        </div>
      </div>
    </div>
    
    
    <div id="disable-confirm" class="modal fade" tabindex="-1" role="dialog" aria-labelledby="myModalLabel1" aria-hidden="true">
      <div class="modal-dialog" style="margin-top: 20%;">
        <div class="modal-content">
          <div class="modal-header">
            <button type="button" class="close" data-dismiss="modal"><span aria-hidden="true">&times;</span><span class="sr-only">Close</span></button>
            <h4 class="modal-title">提醒</h4>
          </div>
          <div class="modal-body">
            <p>你确定要禁用用户吗？</p>
          </div>
          <div class="modal-footer">
            <button type="button" class="btn btn-default" data-dismiss="modal">取  消</button>
            <button type="button" class="btn btn-danger"  data-dismiss="modal">确  定</button>
          </div>
        </div>
      </div>
    </div>
    
   <div id="add-update-panel" class="modal fade" tabindex="-1" role="dialog" aria-labelledby="myModalLabel1" aria-hidden="true" style="width:100%">
      <div class="modal-dialog" >
        <div class="modal-content">
          <div class="modal-header">
            <button type="button" class="close" data-dismiss="modal"><span aria-hidden="true">&times;</span><span class="sr-only">Close</span></button>
            <h4 class="modal-title">新增/编辑</h4>
          </div>
          <div class="modal-body">
          <form action="#" class="form-horizontal">
                    <div class="form-body">
                      <div class="form-group">
                        <label class="col-md-3 control-label">用户帐号</label>
                        <div class="col-md-9">
                          <input type="text" class="form-control input-sm" placeholder="用户帐号" />
                          <span class="help-block">用户用于登录帐号（手机号码）  </span>
                        </div>
                      </div>
                      <div class="form-group">
                        <label class="col-md-3 control-label">登录密码</label>
                        <div class="col-md-9">
                          <div class="input-group">
                            <input type="password" class="form-control input-sm" placeholder="登录密码" />
                            <span class="input-group-addon input-sm">
                            <i class="fa fa-user"></i>
                            </span>
                          </div>
                        </div>
                      </div>
                      <div class="form-group">
                        <label class="col-md-3 control-label">邮箱地址</label>
                        <div class="col-md-9">
                          <div class="input-group">
                            <span class="input-group-addon input-sm">
                            <i class="fa fa-envelope"></i>
                            </span>
                            <input type="email" class="form-control input-sm" placeholder="邮箱地址" />
                          </div>
                        </div>
                      </div>
                      <div class="form-group">
                        <label class="col-md-3 control-label">住户信息</label>
                        <div class="col-md-3">
                          <select class="form-control input-sm" placeholder="小区名字">
		                      <option value="">小区名字</option>
		                      <option>武侯名居</option>
		                      <option>双栏小区</option>
		                      <option>龙江小区</option>
		                    </select>
                        </div>
                        <div class="col-md-2">
                            <select class="form-control input-sm" placeholder="楼栋">
			                      <option value="">楼栋</option>
			                      <option>1栋</option>
			                      <option>2栋</option>
			                      <option>3栋</option>
			                    </select>
                        </div>
                        <div class="col-md-2">
                           <select class="form-control input-sm" placeholder="单元">
		                      <option value="">单元</option>
		                      <option>一单元</option>
		                      <option>二单元</option>
		                      <option>3单元</option>
		                    </select>
                        </div>
                        <div class="col-md-2">
                           <input type="text" class="form-control input-sm" placeholder="门牌号" />
                      </div>
                      </div>
                    </div>
                  </form>
          
          </div>
          <div class="modal-footer">
            <button type="button" class="btn btn-default" data-dismiss="modal">取  消</button>
            <button type="button" class="btn btn-danger"  data-dismiss="modal">确  定</button>
          </div>
        </div>
      </div>
    </div>
<script src="../../js/core/jquery/jquery.min.js"></script>
<script type="text/javascript" src="../../js/core/bootstrap/bootstrap.min.js"></script>    
    <!-- 
    <script src="../scripts/main.js"></script>
    <script src="../scripts/vendor.js"></script>
     -->
    <!-- page plugin -->
    <script type="text/javascript" src="../scripts/plugins/grid/grid.zh-CN.min.js"></script>
    <script type="text/javascript" src="../scripts/plugins/grid/bsgrid.all.min.js"></script>
    <!-- page plugin end -->
    <script type="text/javascript">
    var gridObj;
    function operate(record, rowIndex, colIndex, options) {
        return '<a  href="#" class="btn btn-primary btn-xs mhx" data-toggle="modal" data-target="#add-update-panel">编辑</a><a  href="#" class="btn btn-danger btn-xs mhx" data-toggle="modal" data-target="#disable-confirm">禁用</a>';
    }
    $(function(){
      gridObj = $.fn.bsgrid.init('searchTable', {
          localData: localData,
          // autoLoad: false,
          pageSizeSelect: true,
          stripeRows: true,
          pageSize: 10
      });
      $('#datetime_01 .date[name=start]')
        .datetimepicker({
          clearBtn: true,
          keyboardNavigation: false,
          language: "zh-CN",
          autoclose: true,
          todayHighlight: true,
          format: 'yyyy-mm-dd hh:ii'
        })
        .on('changeDate', function(ev){
          var value = $(this).val();
          console.log(value);
          $('#datetime_01 .date[name=end]').datetimepicker('setStartDate', value);
        });
      $('#datetime_01 .date[name=end]').datetimepicker({
        clearBtn: true,
        keyboardNavigation: false,
        language: "zh-CN",
        autoclose: true,
        todayHighlight: true,
        format: 'yyyy-mm-dd hh:ii'
      });
      
      $('.ibox-tools').css({display:'none'});
    })
    
    var localData = [
    {
        "area":"双栏金水岸",
        "account" : "15202834215",
        "ld": "13栋",
        "dy": "2danyuan",
        "mp": "504",
        "name":"孙晓东" , 
        "type": "业主",
        "date": "2015-08-10 12:48:08",
        "state": "正常",
        "XH":1
    },
    {
        "area":"双栏金水岸",
        "account" : "15202834215",
        "ld": "13栋",
        "dy": "2danyuan",
        "mp": "504",
        "name":"孙晓东" , 
        "type": "业主",
        "date": "2015-08-10 12:48:08",
        "state": "正常",
        "XH":2
    },
    {
        "area":"双栏金水岸",
        "account" : "15202834215",
        "ld": "13栋",
        "dy": "2danyuan",
        "mp": "504",
        "name":"孙晓东" , 
        "type": "业主",
        "date": "2015-08-10 12:48:08",
        "state": "正常",
        "XH":3
    },
    {
        "area":"双栏金水岸",
        "account" : "15202834215",
        "ld": "13栋",
        "dy": "2danyuan",
        "mp": "504",
        "name":"孙晓东" , 
        "type": "业主",
        "date": "2015-08-10 12:48:08",
        "state": "正常",
        "XH":4
    },
    {
        "area":"双栏金水岸",
        "account" : "15202834215",
        "ld": "13栋",
        "dy": "2danyuan",
        "mp": "504",
        "name":"孙晓东" , 
        "type": "业主",
        "date": "2015-08-10 12:48:08",
        "state": "正常",
        "XH":5
    },
    {
        "area":"双栏金水岸",
        "account" : "15202834215",
        "ld": "13栋",
        "dy": "2danyuan",
        "mp": "504",
        "name":"孙晓东" , 
        "type": "业主",
        "date": "2015-08-10 12:48:08",
        "state": "正常",
        "XH":6
    },
    {
        "area":"双栏金水岸",
        "account" : "15202834215",
        "ld": "13栋",
        "dy": "2danyuan",
        "mp": "504",
        "name":"孙晓东" , 
        "type": "业主",
        "date": "2015-08-10 12:48:08",
        "state": "正常",
        "XH":7
    },
    {
        "area":"双栏金水岸",
        "account" : "15202834215",
        "ld": "13栋",
        "dy": "2danyuan",
        "mp": "504",
        "name":"孙晓东" , 
        "type": "业主",
        "date": "2015-08-10 12:48:08",
        "state": "正常",
        "XH":8
    },
    {
        "area":"双栏金水岸",
        "account" : "15202834215",
        "ld": "13栋",
        "dy": "2danyuan",
        "mp": "504",
        "name":"孙晓东" , 
        "type": "业主",
        "date": "2015-08-10 12:48:08",
        "state": "正常",
        "XH":9
    },
    {
        "area":"双栏金水岸",
        "account" : "15202834215",
        "ld": "13栋",
        "dy": "2danyuan",
        "mp": "504",
        "name":"孙晓东" , 
        "type": "业主",
        "date": "2015-08-10 12:48:08",
        "state": "正常",
        "XH":10
    },
    {
        "area":"双栏金水岸",
        "account" : "15202834215",
        "ld": "13栋",
        "dy": "2danyuan",
        "mp": "504",
        "name":"孙晓东" , 
        "type": "业主",
        "date": "2015-08-10 12:48:08",
        "state": "正常",
        "XH":1
    }
    ];
    </script>
  </body>
</html>